html {
  font-size: 75px;
}
body {
  background-color: #fff;
}
.Ht_mask {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
}
.Ht_mask .Ht_maskcontent {
  width: 200px;
  height: 200px;
  background-color: #fff;
  position: absolute;
  padding-top: 50px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}
.Ht_mask .Ht_maskcontent span.fa-spinner {
  font-size: 50px;
  text-align: center;
  display: block;
  margin: 0 auto;
}
.Ht_mask .Ht_maskcontent p {
  font-size: 20px;
  text-align: center;
  position: relative;
}
.Ht_header {
  height: 1.76rem;
  width: 100%;
  background-color: #F9F9F9;
  font-size: 0.53333333rem;
}
.Ht_header h3 {
  line-height: 1.76rem;
  text-align: center;
}
.Ht_header span.fa-search {
  position: absolute;
  top: 0.66666667rem;
  right: 0.26666667rem;
  font-size: 0.53333333rem;
}
.Ht_header span.fa-angle-left {
  font-size: 0.53333333rem;
  position: absolute;
  top: 0.66666667rem;
  left: 0.26666667rem;
}
.Ht_main .Ht_goods li {
  padding: 0.26666667rem 0 0.26666667rem 0.26666667rem;
  height: 5.33333333rem;
  width: 100%;
  border-bottom: 1px solid #ccc;
}
.Ht_main .Ht_goods li a {
  display: block;
  width: 100%;
  height: 100%;
}
.Ht_main .Ht_goods li a .Ht_pic {
  height: 100%;
  width: 5.06666667rem;
  float: left;
}
.Ht_main .Ht_goods li a .Ht_pic img {
  display: block;
  width: 100%;
  height: 100%;
}
.Ht_main .Ht_goods li a .Ht_content {
  overflow: hidden;
  position: relative;
  padding: 0.10666667rem 0 0 0.21333333rem;
}
.Ht_main .Ht_goods li a .Ht_content .Ht_theme p {
  font-size: 0.4rem;
  letter-spacing: 3px;
  line-height: 0.66666667rem;
  color: #000;
}
.Ht_main .Ht_goods li a .Ht_content .Ht_price {
  padding: 0.06666667rem 0;
  font-size: 0.46666667rem;
  color: red;
  font-weight: 600;
}
.Ht_main .Ht_goods li a .Ht_content .Ht_info {
  padding-top: 0.13333333rem;
  padding-right: 0.26666667rem;
  font-size: 0.26666667rem;
  color: #ccc;
}
.Ht_main .Ht_goods li a .Ht_content .Ht_info .Ht_addr {
  padding-right: 0.06666667rem;
  border-right: 1px solid #ccc;
}
.Ht_main .Ht_goods li a .Ht_content .Ht_info .Ht_message {
  float: right;
}
.Ht_main .Ht_goods li a .Ht_content .Ht_info .Ht_message span.fa-comments {
  padding-right: 0.06666667rem;
}
.Ht_main .Ht_goods li:nth-of-type(1) {
  border-top: 1px solid #ccc;
}
.Ht_clickMore {
  position: absolute;
  bottom: -6.4rem;
  left: 0;
  height: 1.06666667rem;
  line-height: 1.06666667rem;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  text-align: center;
  font-size: 0.53333333rem;
  color: #fff;
}
.Ht_rightside {
  width: 100%;
  height: 100%;
  background-color: red;
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  transform: translateX(100%);
  -webkit-transform: translateX(100%);
}
.Ht_r_top {
  width: 100%;
  height: 1.70666667rem;
  padding: 0.26666667rem;
  position: relative;
  background-color: #F9F9F9;
}
.Ht_r_top .fa-angle-left {
  position: absolute;
  top: 0.26666667rem;
  left: 0.13333333rem;
  font-size: 0.6rem;
  line-height: 1.06666667rem;
  width: 1.93333333rem;
  height: 100%;
  color: #000;
}
.Ht_r_top .Ht_r_discount {
  position: absolute;
  left: 1.13333333rem;
  width: 1.06666667rem;
  height: 0rem;
  line-height: 1.06666667rem;
  font-size: 0.26666667rem;
  text-align: center;
}
.Ht_r_top .Ht_r_discount a {
  display: block;
  width: 100%;
  height: 100%;
}
.Ht_r_top .Ht_r_discount .Ht_r_disbox {
  position: absolute;
  top: 1.12rem;
  left: -0.37333333rem;
  background-color: #333333;
  width: 3.2rem;
  height: 4.26rem;
  border-radius: 0.2rem;
  -webkit-border-radius: 0.2rem;
  opacity: 0;
}
.Ht_r_top .Ht_r_discount .Ht_r_disbox:before {
  content: "";
  display: block;
  position: absolute;
  top: -0.29333333rem;
  left: 0.53333333rem;
  width: 0.66666667rem;
  height: 0.66666667rem;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  background-color: #333333;
}
.Ht_r_top .Ht_r_discount .Ht_r_disbox ul {
  width: 100%;
  height: 100%;
}
.Ht_r_top .Ht_r_discount .Ht_r_disbox ul li {
  height: 33.3333%;
  width: 100%;
  border-bottom: 1px solid #000;
}
.Ht_r_top .Ht_r_discount .Ht_r_disbox ul li a {
  display: block;
  width: 100%;
  height: 100%;
  color: #fff;
  text-align: center;
  line-height: 1.41333333rem;
}
.Ht_r_top form {
  background-color: #f9f9f9;
  width: 100%;
  height: 100%;
  padding-left: 0.46666667rem;
}
.Ht_r_top form .Ht_r_search {
  height: 1.06666667rem;
  width: 8rem;
  font-size: 0.33333333rem;
  border-radius: 0.2rem;
  padding-left: 1.73333333rem;
}
.Ht_r_top form .Ht_r_btn {
  position: absolute;
  width: 1.06666667rem;
  height: 1.06666667rem;
  line-height: 1.06666667rem;
  top: 0.26666667rem;
  right: 0.13333333rem;
  font-size: 0.33333333rem;
  color: #000;
  background-color: #f9f9f9;
}
.Ht_detail {
  padding: 0 0.06666667rem;
  width: 100%;
  background-color: #fff;
  position: absolute;
  z-index: 11;
  top: 0;
  left: 0;
  transform: translateX(100%);
  -webkit-transform: translateX(100%);
}
.Ht_detail .Ht_d_top {
  width: 100%;
  height: 1.70666667rem;
  padding: 0.26666667rem;
  position: relative;
  background-color: #F9F9F9;
}
.Ht_detail .Ht_d_top .fa-angle-left {
  position: absolute;
  z-index: 100;
  top: 0.26666667rem;
  left: 0.13333333rem;
  font-size: 0.6rem;
  line-height: 1.06666667rem;
  width: 1.93333333rem;
  height: 100%;
  color: #000;
}
.Ht_detail .Ht_d_top .Ht_d_comment {
  font-size: 0.4rem;
  line-height: 1.17333333rem;
}
.Ht_detail .Ht_d_top .Ht_d_comment span {
  padding: 0 0.13333333rem;
}
.Ht_detail .Ht_d_main {
  padding-top: 0.26666667rem;
  padding-bottom: 0.26666667rem;
}
.Ht_detail .Ht_d_main h3 {
  font-size: 0.53333333rem;
}
.Ht_detail .Ht_d_main p:nth-of-type(1) {
  color: orangered;
  font-size: 0.4rem;
  padding: 0.13333333rem 0.06666667rem;
}
.Ht_detail .Ht_d_main p:nth-of-type(2) {
  font-size: 0.24rem;
  color: #ccc;
}
.Ht_detail .Ht_d_info p {
  font-size: 0.37333333rem;
}
.Ht_detail .Ht_d_info img {
  float: right;
}
.Ht_d_foot .Ht_way p:nth-of-type(1) {
  padding: 0.2rem;
  font-size: 0.26666667rem;
}
.Ht_d_foot .Ht_way p:nth-of-type(2),
.Ht_d_foot .Ht_way p:nth-of-type(3) {
  font-size: 0.26666667rem;
  color: skyblue;
  padding: 0.13333333rem;
}
.Ht_d_foot .Ht_talk p {
  padding: 0.13333333rem 0.06666667rem;
  font-size: 0.26666667rem;
}
.Ht_d_foot .Ht_greet .circle {
  position: relative;
  width: 1.33333333rem;
  height: 1.33333333rem;
  border-radius: 50%;
  background-color: #fff;
  border: 1px solid #000;
  float: left;
  margin: 0.26666667rem 1.73333333rem;
}
.Ht_d_foot .Ht_greet .circle span {
  position: absolute;
  bottom: -0.46666667rem;
  left: 50%;
  transform: translatX(-50%, 0);
  font-size: 0.33333333rem;
}
.Ht_d_foot .Ht_greet .circle i {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 0.66666667rem;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}
.Ht_d_foot .Ht_share {
  margin-top: 0.33333333rem;
  position: relative;
  height: 1.33333333rem;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.Ht_d_foot .Ht_share > span {
  position: absolute;
  top: -0.13333333rem;
  left: 50%;
  transform: translate(-50%, 0);
  font-size: 0.16rem;
  width: 1.8rem;
  text-align: center;
  background-color: #fff;
}
.Ht_d_foot .Ht_share ul {
  width: 100%;
  height: 100%;
}
.Ht_d_foot .Ht_share ul li {
  float: left;
  height: 100%;
  line-height: 1.33333333rem;
  width: 25%;
  text-align: center;
}
.Ht_d_foot .Ht_share ul li a {
  display: block;
  width: 100%;
  height: 100%;
}
.Ht_d_foot .Ht_share ul li a span:nth-of-type(1) {
  font-size: 0.4rem;
  color: blue;
}
